<#include "constants.ftl" />
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="${SERVER_SIDE_CONTEXT}/statics/favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="${SERVER_SIDE_CONTEXT}/statics/css/data_mart.css"/>
    <link rel="stylesheet" href="${SERVER_SIDE_CONTEXT}/statics/font-awesome/css/font-awesome.min.css"/>
    <script src="${SERVER_SIDE_CONTEXT}/statics/js/jquery-1.11.1.js"></script>
    <style>
        /*开发注意：
         * 为了让背景background-size能兼容到IE7\8，保证不同分辨率背景不会发生改变；请将此css必须写在页面中！不可放置css外链中
         * behavior放置在css文件夹中请正确引用
        */
        body {
            font-family: "微软雅黑", "Microsoft Yahei", 'Arial', 'san-serif';
            /*color: #fff;*/
            font-size: 16px;
            margin: 0;
            padding: 0;
            height: 100%;
            background: url(${SERVER_SIDE_CONTEXT}/statics/images/bg.png) center;
            background-size: cover;
            -ms-behavior: url(${SERVER_SIDE_CONTEXT}/statics/css/backgroundsize.min.htc);
            behavior: url(${SERVER_SIDE_CONTEXT}/css/backgroundsize.min.htc);
            /*overflow: hidden;*/
        }

        .ssm_header {
            margin-bottom: 50px;
        }
    </style>
</head>

<body>
<div id="header" class="ssm_header">

    <div class="logo_line">
        <a href="${SERVER_SIDE_CONTEXT}"><img src="${SERVER_SIDE_CONTEXT}/statics/images/home.png"></a>
        <span>Sealer Ssm Platform</span>
    </div>

    <div class="right_menu">

        <div class="menu_nav">
            <a href="#" id="nav_flow">
                <#if userAvatarUrl??>
                    <img src="${userAvatarUrl}">
                <#else>
                    <img src="${SERVER_SIDE_CONTEXT}/statics/images/user_ico.png">
                </#if>

                <span>${Session["org.apache.shiro.subject.support.DefaultSubjectContext_PRINCIPALS_SESSION_KEY"]! "guest"}</span>
                <img src="${SERVER_SIDE_CONTEXT}/statics/images/arrow_down_ico.png">
            </a>
        </div>

        <div id="b">
            <ul>
                <li>
                    <a class="b_a" href="${SERVER_SIDE_CONTEXT}/userOperations/passwordModifyPre">
                        <P><i class="fa fa-lock"></i></P>
                        <span>修改密码</span>
                    </a>
                </li>

                <li>
                    <a class="b_a" href="${SERVER_SIDE_CONTEXT}/logout">
                        <P><i class="fa fa-power-off"></i></P>
                        <span>退出系统</span>
                    </a>
                </li>

            </ul>
        </div>

    </div>

    <!--
        描述：右侧 菜单js 再次点击和点击其他地方关闭#b
    -->
    <script>
        $b = $("#b");
        $("#nav_flow").on({
            "click": function () {
                $b.toggle();
                return false;
            }
        });
        $(document).on({
            "click": function (e) {
                var src = e.target;

                if (src.id && src.id === "b") {
                    return false;
                } else {
                    $b.hide();
                }
            }
        });
    </script>

</div>
</body>
</html>